
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>评委打分</title>
<script src="http://localhost:8080/vote/js/jquery-1.12.4.js"></script>
<script src="http://localhost:8080/vote/layui/layui.js"></script>
<link rel="stylesheet" href="http://localhost:8080/vote/layui/css/layui.css" media="all">
<meta http-equiv=”Content-type” name=”viewport”
	content=”initial-scale=1.0, maximum-scale=1.0, user-scalable=no,
	width=device-width”>
</head>
<style>
.item1, .item2 {
	width: 20%;
	border: 1px solid red;
	display: inline-block;
}

.item1 {
	margin-left: 20%;
}

.item2 {
	float: right;
	margin-right: 20%;
}

img {
	border-radius: 50%;
	width: 150px;
	height: 150px;
}

.item22 {
	text-align: center;
	padding-top: 30px;
}

.item22>img {
	text-align: center;
}

.txt {
	text-align: center;
	width: 100%;
	line-height: 150px;
	color: #91e2c0;
	font-size: 20px;
}

.item {
	background-color: #4be2c4;
	width: 100%;
}

html, body {
	height: 100%;
	background: #5D99CF;
	overflow: hidden;
}
</style>

<body>
	<div>
		<div class="txt">评委打分</div>
		<div class="item">
			<div class="item1">
				<div class="item22">
					<img class="item11" src="../images/tou.jpg">
				</div>
				<div class="item22">
					<span class="sp"></span>号选手：<input id="score1" name="score1"
						type="text" placeholder="请输入0-100分的有效分数">
				</div>
				<div class="item22">
					<button id="btn1" type="button" class="layui-btn">确认</button>
				</div>
			</div>

			<div class="item2">
				<div class="item22">
					<img class="item12" src="../images/demo-1-bg.jpg">
				</div>
				<div class="item22">
					<span class="sp1"></span>号选手：<input id="score2" name="score2"
						type="text" placeholder="请输入0-100分的有效分数">
				</div>
				<div class="item22">
					<button id="btn2" type="button" class="layui-btn">确认</button>
				</div>
			</div>

		</div>
	</div>

</body>
<script>
	var btn1 = document.getElementById("btn1");
	btn1.addEventListener("click", function() {
		var test = /^\d$|^[0-9][0-9]$|100/ig;
		var score1 = document.getElementById("score1").value;
		if (!test.test(score1)) {
			alert("请输入0-100的整数！");
		}
	})

	var btn2 = document.getElementById("btn2");
	btn2.addEventListener("click", function() {
		var test = /^\d$|^[0-9][0-9]$|100/ig;
		var score2 = document.getElementById("score2").value;
		if (!test.test(score2)) {
			alert("请输入0-100的整数！");
		}
	})
</script>
<script>
	$(function() {
		var t;
		var r;
		var t2;
		var r2;
		$.ajax({
			url : "../judge/imgs",
			type : "post",
			data : {},
			dataType : "json",
			success : function(result) {
				console.log(result);
				console.log(result.length);
				console.log(result[0]);
				var t1 = eval(result);

				$(".item11").attr("src",
						"http://localhost:8080/vote/" + t1[0].singerImg);
				$(".item12").attr("src",
						"http://localhost:8080/vote/" + t1[1].singerImg);
				$(".sp").text(t1[0].sid);
				$(".sp1").text(t1[1].sid);
				
				$.ajax({
					url : "http://localhost:8080/vote/judge/rid",
					type : "post",
					data : {},
					dataType : "json",
					success : function(result) {
						console.log(result);
						var tmp = eval(result);
						t = tmp.rid;
						t2 = tmp.rid;
						r = tmp.sidOne;
						r2 = tmp.sidTwo;
						console.log("sidOne:" + result.sidOne);
						console.log("sidTwo:" + result.sidTwo);
						console.log("rid:" + result.rid);

					},
					error : function(){
						alert("error1");
					}
				})

			},
			error : function(){
				alert("error2");
			}

		});

		$(document).on("click", "#btn1", function() {

			console.log("t:" + t + "===r:" + r);
			var score1 = $("#score1").val();
			console.log("score1:"+score1);
			$.ajax({
				url : "http://localhost:8080/vote/judge/score",
				type : "post",
				data : {
					"sid" : r,
					"score1" : score1,
					"rid" : t
				},
				dataType : "json",
				success : function(re) {
					var t = eval(re);
					alert(t.msg);
					
				},
				error : function(re) {
					alert("error3");
				}

			})
		});

		$("#btn2").on("click", function() {

			console.log("t:" + t2 + "===r:" + r2);
			var score2 = $("#score2").val();
			console.log("score2:"+score2);
			$.ajax({
				url : "http://localhost:8080/vote/judge/score2",
				type : "post",
				data : {
					"sid2" : r2,
					"score2" : score2,
					"rid2" : t2
				},
				dataType : "json",
				success : function(re) {
					var t = eval(re);
					alert(t.msg);
				},
				error : function() {
					alert("error4");
				}

			})
		});
	})
</script>



</html>